<%
if (session.getAttribute("username") == null) {
	%><jsp:forward page="login.jsp" /><%
}
%>

<jsp:useBean id="user" class="bean.PollUser" scope="request" />
<jsp:setProperty name="user" property="*"/>
<%@ page language="java" contentType="text/html; charset=GBK"
	pageEncoding="GBK" import="bean.PollUser, model.PollUserImpl, connection.DbConnection, java.sql.*" %>

<%
	// Get user bean all setup...
	//session.setAttribute("user",user);
	
	// Redirect to login page if user not logged in
	if (session.getAttribute("username") == null) {
		response.sendRedirect("login.jsp");
	}
	String generic = (String)session.getAttribute("generic").toString();
	String generichide = "block";
	if(generic != null && generic.equals("1")){
		generichide = "none";
	}
	
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK"> 
<link rel="stylesheet" href="style/stylesheet.css" type="text/css" >
<title>dbPoll/Settings</title>
<script type="text/javascript">

    function check_password(form){

        //Clear success msgs
        document.getElementById("device_msgs").innerHTML = "";
        document.getElementById("personal_success").innerHTML = "";
        document.getElementById("pw_success").innerHTML = "";
    	
        var invalid = false;
        if (document.forms.password_form.current_pw.value == "") {
            document.getElementById("current_pw_msg").innerHTML = "<div class=\"error\" style=\"display: inline;\" >* Please provide current password. </div>";
            invalid = true;
        } else {
            document.getElementById("current_pw_msg").innerHTML = "";
        }
        if (document.forms.password_form.new_pw.value == "") {
            document.getElementById("new_pw_msg").innerHTML = "<div class=\"error\" style=\"display: inline;\" >* Please provide new password.</div>";
            invalid = true;
        } else {
        	document.getElementById("new_pw_msg").innerHTML = "";
        }
        if (document.forms.password_form.repeat_pw.value == "") {
            document.getElementById("repeat_pw_msg").innerHTML = "<div class=\"error\" style=\"display: inline;\" >* Please provide a repeated password.</div>";
            invalid = true;
        } else {
            document.getElementById("repeat_pw_msg").innerHTML = "";
        }
        if (document.forms.password_form.repeat_pw.value != "" && document.forms.password_form.repeat_pw.value != document.forms.password_form.new_pw.value) {
            document.getElementById("repeat_pw_msg").innerHTML = "<div class=\"error\" style=\"display: inline;\" >* Repeat password does not match new password.</div>";
            invalid = true;
        } else if (document.forms.password_form.repeat_pw.value != "") {
            document.getElementById("repeat_pw_msg").innerHTML = "";
        }   
        if (invalid) {
            document.getElementById("pw_success").innerHTML = "";
            return false;
        } else {
            return true;
        }
    }

    function check_personal_form (form) {

        //Clear success msgs
        document.getElementById("device_msgs").innerHTML = "";
        document.getElementById("personal_success").innerHTML = "";
        document.getElementById("pw_success").innerHTML = "";
        
        var invalid = false;
        if (document.forms.personal_details_form.first_name.value == "") {
            document.getElementById("first_name_msg").innerHTML = "<div class=\"error\" style=\"display: inline;\" >* Please provide a first name. </div>";
            invalid = true;
        } else {
            document.getElementById("first_name_msg").innerHTML = "";
        }
        if (document.forms.personal_details_form.last_name.value == "") {
            document.getElementById("last_name_msg").innerHTML = "<div class=\"error\" style=\"display: inline;\" >* Please provide a last name. </div>";
            invalid = true;
        } else {
            document.getElementById("last_name_msg").innerHTML = "";
        }
        if (document.forms.personal_details_form.email.value == "") {
            document.getElementById("email_msg").innerHTML = "<div class=\"error\" style=\"display: inline;\" >* Please provide an email address. </div>";
            invalid = true;
        } else {
            document.getElementById("email_msg").innerHTML = "";
        }
        if (invalid) {
            document.getElementById("personal_success").innerHTML = "";
            return false;
        } else {
            return true;
        }
    }

    function check_add_device (form) {

        //Clear success msgs
        document.getElementById("device_msgs").innerHTML = "";
        document.getElementById("personal_success").innerHTML = "";
        document.getElementById("pw_success").innerHTML = "";
         
		if (document.getElementById("add_device").value == "") {
			document.getElementById("add_device_msg").style.display = "inline";
			return false;
		} else {
			document.getElementById("add_device_msg").style.display = "none";
			return true;
		}
    }

    function check_delete_device (form) {

        //Clear success msgs
        document.getElementById("device_msgs").innerHTML = "";
        document.getElementById("personal_success").innerHTML = "";
        document.getElementById("pw_success").innerHTML = "";
        
        var elems = document.getElementsByTagName("input");
        var foundelem = false;
        for (x in elems) {
            if (elems.item(x).id == "device_id") {
                if (elems.item(x).checked) {
                    foundelem=true;
                    break;
                }
            }
        }
        if (!foundelem) {
            document.getElementById("delete_device_msg").style.display = "inline";
       		return false;
        } else {
            document.getElementById("delete_device_msg").style.display = "none";
            return true;
        }
    }
    
</script>
</head>

<body onload="user_type();">
<div class="bg">
<div class='content' >
<jsp:include page="nav.jsp" />
	<div id='title' class= "pagetitle">Settings<input type="button" style="font-size:8pt;color:white;background-color:lightblue;border:none;" value="Quick Help"></div>
	
	<div class="entrytitle" style="display:<%=generichide %>">
	Change Password
	<div class="entry">
		<form action="changePasswordServlet" method="POST" name="password_form" >
		<div class="tableborder"><table class="blockTable">
		<tbody>
		<tr><td>Current Password</td><td><input type="password" name="current_pw" /></td><td><div id="current_pw_msg" ><% if (session.getAttribute("settings_incorrect_pw") != null && session.getAttribute("settings_incorrect_pw").equals("t")) {out.println("<div class=\"error\" style=\"display: inline;\" >* Current password incorrect</div>");}    %></div></td></tr>
		<tr><td>New Password</td><td><input type="password"/ name="new_pw" ></td><td id="new_pw_msg"></td></tr>
		<tr><td>Repeat New Password</td><td><input type="password" name="repeat_pw" /></td><td id="repeat_pw_msg"></td></tr>
		<tr><td></td><td><input type="submit" class="button" value="Change" onclick="return check_password(this);" /></td><td></td></tr>
		</tbody>
		</table>
		</div>
		</form>
		<div id="pw_success">
		<%
			if (session.getAttribute("settings_success") != null && session.getAttribute("settings_success").equals("t")) {
				out.println("<div class=\"note\" style=\"display: inline;\" > Password successfully changed! </div>");
			}
		%>
		</div>
	</div>
	</div>
	
	<div class="entrytitle" style="display:<%=generichide %>">
	Personal Details
	<div class="entry">
		<form action="changePersonalDetailsServlet" method="POST" name="personal_details_form" >
		<div class="tableborder"><table class="blockTable" >
		<tbody>
		<tr><td>First Name</td><td><input type="text" value="<% if (session.getAttribute("fname") != null) {out.println(session.getAttribute("fname").toString());}	%>" name="first_name" /></td><td id="first_name_msg" ></td></tr>
		<tr><td>Last Name</td><td><input type="text" value="<% if (session.getAttribute("lname") != null) {out.println(session.getAttribute("lname").toString());} %>" name="last_name" /></td><td id="last_name_msg" ></td></tr>
		<tr><td>Email</td><td><input type="text" value="<% if (session.getAttribute("email") != null) {out.println(session.getAttribute("email").toString());} %>" name="email" ></td><td id="email_msg" ></td></tr>
		<tr><td></td><td><input type="submit" class="button" value="Save" onclick="return check_personal_form(this);" /></td><td></td></tr>
		</tbody>
		</table></div>
		</form>
		<div id="personal_success">
		<%
			if (session.getAttribute("settings_change_personal_success") != null && session.getAttribute("settings_change_personal_success").equals("t")) {
				out.println("<div class=\"note\" style=\"display: inline;\" > Personal details successfully changed! </div>");
			}
		%>
		</div>
	</div>
	</div>
	
	<div class="entrytitle">
	Add Keypad Device
	<div class="entry">
		<div class="tableborder"><table class="blockTable" >
		<thead><tr><td colspan="3">Device IDs</td></tr></thead>
		<tbody>
		<form id="delete_device_form" action="deleteDeviceServlet" method="POST" >
		<%
			DbConnection db = new DbConnection();
			String sql = "Select * from PollUser, User_Device where Username = '"+session.getAttribute("username")+"' AND Username = PollUsername";
			ResultSet rs = db.doSelect(sql);
			boolean hasNoDevices = true;
			while (rs.next()) {
				hasNoDevices = false;
				out.println("<tr><td><input type=\"radio\" name=\"device_id\" id=\"device_id\" value=\""+rs.getString("DeviceID")+"\" /></td><td colspan=\"2\">"+rs.getString("DeviceID")+"</td></tr>");
			}
			if (hasNoDevices) {
				out.println("<tr><td colspan=\"3\">No Devices</td></tr>");
			} else {
				out.println("<tr><td></td><td><input type=\"submit\" class=\"button\" value=\"Delete\" onclick=\"return check_delete_device(this);\" /></td><td><div id=\"delete_device_msg\" class=\"error\" > Please select device to delete. </div></td></tr>");
			}
			db.close();
		%>
		</form>
		<form action="addDeviceServlet" method="POST" >
		<tr><td>Add device</td><td><input type="text" name="add_device" id="add_device" /></td><td><div id="add_device_msg" class="error" > Please input device id. </div></td></tr>
		<tr><td></td><td><input type="submit" class="button" value="Add" onclick="return check_add_device(this);" /></td><td></td></tr>
		</form>
		</tbody>
		</table>
		<div id="device_msgs">
		<%
			if (session.getAttribute("settings_add_device_success") != null && session.getAttribute("settings_add_device_success").equals("t")) {
				out.println("<div class=\"note\" style=\"display: inline;\" > Successfully added device id. </div>");
			}
			if (session.getAttribute("settings_delete_device_success") != null && session.getAttribute("settings_delete_device_success").equals("t")) {
				out.println("<div class=\"note\" style=\"display: inline;\" > Successfully deleted device. </div>");
			}
		%>
		</div>
		</div>
		
	</div>
	</div>
	
	
	
	</div>
	
	

</div>
<style>
#onlinehelp{position:absolute;display:none;z-index:2;border:5px solid lightblue;background-color:#33aecc;color:white}
</style>
<div id="onlinehelp"></div>
<script>
var demo = document.getElementById("title");
var gg = demo.getElementsByTagName("input");
var ei = document.getElementById("onlinehelp");
for(i=0; i<gg.length; i++){
 var ts = gg[i];
 ts.onmousemove = function(event){
  event = event || window.event;
  ei.style.display = "block";
  ei.innerHTML = '1. To change your password you need to input the current password<br>2. You can also change your name, email or add a device id at the same time<br>3. Click the submit button to confirm the information and system will send an email<br> * For more help please click the button';
  ei.style.top  = document.body.scrollTop + event.clientY  -65 + "px";
  ei.style.left = document.body.scrollLeft + event.clientX  +35 + "px";
 }
 ts.onmouseout = function(){
  ei.innerHTML = "";
  ei.style.display = "none";
 }
 ts.onclick = function(){
	 location.href="/DBP/OnlineHelp/ModifyAccount.jsp";
 }
}
</script>
</body>
</html>